iT邦幫忙

0

Gulp 壓縮優化程式碼(2) DAY89

  • 分享至 

  • xImage
  •  

上一篇有介紹壓縮的一些套件了

不過有時候 我們在開發的時候

有時壓縮 有時不壓縮

那要怎麼解決

所以今天就來介紹

minimistgulp-if 套件

https://www.npmjs.com/package/minimist

https://www.npmjs.com/package/gulp-if

npm install minimist gulp-if --save

載入

var minimist = require('minimist')
var envOptions = {
    // 關鍵詞
    string: 'env',
    // 預設使用 develop 環境
    default: {
        env: 'develop'
    }
}

// 把傳入的參數 記錄下來
var option  = minimist(process.argv.slice(2),envOptions);

那要怎麼傳入參數呢??

// 可在終端機輸入 gulp --env 參數
// 這樣就能帶入至 option 設定

加入 gulp-if 來判斷
以sass為例

gulp.task('sass', function () {
    return gulp.src('./source/scss/**/*.scss')
    .pipe($.plumber())
    .pipe($.sourcemaps.init())
    .pipe($.sass().on('error', $.sass.logError))
    .pipe($.postcss([autoprefixer()]))
    .pipe($.if(option.env === 'production',$.cleanCss()))
    .pipe($.sourcemaps.write('.'))
    .pipe(gulp.dest('./public/css'))
    .pipe(browserSync.stream())
});
 // 前面為判斷式
 .pipe($.if(option.env === 'production',$.cleanCss()))

當然你的 bable 與 vendorJS
也可以自行加入

那今天的介紹就到這裡
若有任問題容有誤
都可以跟我說唷/images/emoticon/emoticon41.gif


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言